<!--<script setup>-->
<!--import {ref} from "vue";-->
<!--import $router from "@/router/index.js";-->
<!--import {login, register} from "@/api/UserApi.js";-->
<!--import TipUtil from "@/utils/message.js";-->

<!--const formModel = ref({-->
<!--  username: '',-->
<!--  password: '',-->
<!--  confirmPassword: ''-->
<!--})-->
<!--const state = ref({-->
<!--  register: false,-->
<!--  showLoading: false-->
<!--})-->
<!--const handleLogin = () => {-->
<!--  const form = formModel.value;-->
<!--  state.value.showLoading = true;-->
<!--  if (!validateField(form.username, '用户名') || !validateField(form.password, '密码')) {-->
<!--    state.value.showLoading = false;-->
<!--    return-->
<!--  }-->
<!--  login(form).then((resp) => {-->
<!--    console.log(resp);-->
<!--    localStorage.setItem("chatUserInfo", JSON.stringify(resp));-->
<!--    // 连接WebSocket-->
<!--    window.socket = new WebSocket("ws://127.0.0.1:16250/chat-online/websocket");-->
<!--    window.socket.onopen = function () {-->
<!--      console.log("WebSocket连接成功");-->
<!--    };-->
<!--    state.value.showLoading = false;-->
<!--    resetForm();-->
<!--    $router.replace('/chat-online')-->
<!--  }).catch(() => {-->
<!--    resetForm();-->
<!--    state.value.showLoading = false;-->
<!--  });-->
<!--}-->
<!--const handleRegister = () => {-->
<!--  const form = formModel.value;-->
<!--  state.value.showLoading = true;-->
<!--  if (!validateField(form.username, '用户名') || !validateField(form.password, '密码') || !validateField(form.confirmPassword, '确认密码')) {-->
<!--    state.value.showLoading = false;-->
<!--    return-->
<!--  }-->
<!--  if (form.password !== form.confirmPassword) {-->
<!--    TipUtil.info('两次输入的密码不一致!');-->
<!--    state.value.showLoading = false;-->
<!--    return-->
<!--  }-->
<!--  form.nickname = form.username;-->
<!--  register(form).then((resp) => {-->
<!--    resetForm();-->
<!--    TipUtil.success('注册成功!');-->
<!--    state.value.showLoading = false;-->
<!--    state.value.register = false;-->
<!--  }).catch(() => {-->
<!--    resetForm();-->
<!--    state.value.showLoading = false;-->
<!--  });-->
<!--}-->
<!--const validateField = (field, msg) => {-->
<!--  if (!field) {-->
<!--    TipUtil.info('请输入' + msg);-->
<!--    return false;-->
<!--  }-->
<!--  return true;-->
<!--}-->
<!--const resetForm = () => {-->
<!--  formModel.value.username = '';-->
<!--  formModel.value.password = '';-->
<!--  formModel.value.confirmPassword = '';-->
<!--  formModel.value.nickname = '';-->
<!--}-->
<!--const showRegister = (flag) => {-->
<!--  state.value.register = flag;-->
<!--}-->
<!--</script>-->

<!--<template>-->
<!--&lt;!&ndash;登录页面  &ndash;&gt;-->
<!--  <div class="login-form">-->
<!--    <d-card shadow="always" class="card-demo-basic">-->
<!--      <template #avatar>-->
<!--        <d-avatar imgSrc="https://devui.design/components/assets/logo.svg" :width="48" :height="48" :isRound="false"></d-avatar>-->
<!--      </template>-->
<!--      <template #title>在线聊天系统</template>-->
<!--      <template #content>-->
<!--        <d-form :data="formModel" label-size="sm" label-align="end">-->
<!--          <d-form-item field="username" label="用户名">-->
<!--            <d-input v-model="formModel.username" placeholder="请输入用户名" clearable />-->
<!--          </d-form-item>-->
<!--          <d-form-item field="password" label="密码">-->
<!--            <d-input v-model="formModel.password" placeholder="请输入密码" clearable show-password />-->
<!--          </d-form-item>-->
<!--          <d-form-item field="confirmPassword" label="确认密码" v-if="state.register">-->
<!--            <d-input v-model="formModel.confirmPassword" placeholder="请再次确认密码" clearable show-password />-->
<!--          </d-form-item>-->
<!--          <d-form-operation class="form-demo-form-operation">-->
<!--            <d-button variant="solid" @click="handleRegister" v-if="state.register" :loading="state.showLoading">立即注册</d-button>-->
<!--            <d-button variant="solid" @click="handleLogin" v-else :loading="state.showLoading">立即登录</d-button>-->
<!--          </d-form-operation>-->
<!--        </d-form>-->
<!--      </template>-->
<!--      <template #actions>-->
<!--        <a @click="showRegister(false)" href="javascript:void(0);" v-if="state.register">已有账号，立即登录</a>-->
<!--        <a @click="showRegister(true)" href="javascript:void(0);" v-else>还没账号，立即注册？</a>-->
<!--      </template>-->
<!--    </d-card>-->
<!--  </div>-->
<!--</template>-->

<!--<style scoped>-->
<!--.login-form {-->
<!--  display: flex;-->
<!--  justify-content: center;-->
<!--  padding-top: calc((100vh - 320px) / 2);-->
<!--}-->
<!--.card-demo-basic {-->
<!--  cursor: pointer;-->
<!--  min-width: 350px;-->
<!--}-->
<!--</style>-->